<template>
  <div class="app-container">
    <el-form
      v-has-permi="['exam:download']"
      :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="地区" prop="place" v-has-permi="['exam:download']">
        <el-select
          @change="findSchool" v-model="queryParams.place" placeholder="请输入地区" clearable>
          <el-option
            v-for="dict in dict.type.place"
            :key="dict.value"
            :label="dict.value"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="学校" prop="school" >
        <el-select v-model="queryParams.school" placeholder="请选择学校" clearable>
          <el-option
            v-for="dict in dict.type.school"
            :key="dict.school"
            :label="dict.school"
            :value="dict.school"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="专业" prop="profession">
        <el-select v-model="queryParams.profession" placeholder="请选择专业" clearable>
          <el-option
            v-for="dict in dict.type.profession"
            :key="dict.value"
            :label="dict.value"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary"
                   icon="el-icon-search"
                   size="mini"
                   @click="handleQuery"
                   v-has-permi="['exam:download']">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"  v-has-permi="['exam:download']">重置</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="tableData" style="width: 100%" v-has-permi="['exam:download']">
      <el-table-column prop="data" label="文件名"></el-table-column>

      <el-table-column prop="" label="下载" >
        <el-button
          size="mini"
          slot-scope="scope"
          @click="downloadFile(scope.row.data)"
          v-has-permi="['exam:download']"
        >下载
        </el-button>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="handleQuery"
    />
  </div>
</template>

<script>

import {findSchool, getFileNameList, downloadFile} from "@/api/provinceSchoolProfession";

export default {
  name: "School",
  data() {
    return {
      dict: {
        type: {
          school: {},
          place: [
            {value: '北京'},{value: '天津'}, {value: '河北'}, {value: '山西'}, {value: '内蒙古'}, {value: '辽宁'}, {value: '吉林'}, {value: '黑龙江'}, {value: '上海'}, {value: '江苏'}, {value: '浙江'}, {value: '安徽'}, {value: '福建'}, {value: '江西'}, {value: '山东'}, {value: '河南'}, {value: '湖北'}, {value: '湖南'}, {value: '广东'}, {value: '广西'}, {value: '海南'}, {value: '重庆'}, {value: '四川'}, {value: '贵州'}, {value: '云南'}, {value: '西藏'}, {value: '陕西'}, {value: '甘肃'}, {value: '青海'}, {value: '宁夏'}, {value: '新疆'}, {value: '台湾'}
          ]
        }
      },
      loading: true,
      ids: [],
      single: true,
      multiple: true,
      showSearch: true,
      total: 0,
      title: "",
      open: false,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        place: undefined,
        school: undefined,
        profession: undefined
      },
      form: {},
      tableData: [],
      rules: {
        location: [
          {required: true, message: "地区不能为空", trigger: "blur"},
          {required: true, message: "学校不能为空", trigger: "blur"}
        ]
      }
    };
  },
  methods: {
    findSchool() {
      let place = this.queryParams.place
      findSchool(place).then(response => {
        this.dict.type.school = response;
      }).catch(error => {
        console.error(error);
      });
    },
    downloadFile(fileName) {
      downloadFile(fileName).then(response => {
        let data = response;
        let blob = new Blob([data], {type: 'application/octet-stream'});
        let downloadLink = document.createElement('a');
        let url = URL.createObjectURL(blob);
        downloadLink.href = url;
        downloadLink.download = fileName;
        document.body.appendChild(downloadLink);
        downloadLink.click();
        document.body.removeChild(downloadLink);
      }).catch(response => {
        console.log("error")
      })
    },
    handleQuery: function () {
      this.queryParams.location = 1;
      getFileNameList(this.queryParams.place, this.queryParams.school).then(response => {
        let cache = response;
        for (let i = 0; i < cache.length; i++) {
          this.tableData.push({data: cache[i]})
        }
      }).catch(response => {
        console.error("error")
      })
    },
    resetQuery() {
      this.resetForm("queryForm");
    }
  }
};
</script>
